<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1>首页</h1>
<form th:action="@{/testRequestBody}" method="post">
    <input name="username" type="text">
    <input name="password" type="password">
    <input type="submit" value="测试@RequestBody注解">
</form>
<form th:action="@{/testRequestEntity}" method="post">
    <input name="username" type="text"><br/>
    <input name="password" type="password"><br/>
    <input type="submit" value="测试RequestEntity类">
</form>
<a th:href="@{testResponse}">通过servletAPI的response对象响应浏览器数据</a>
<a th:href="@{testResponseBody}">通过@ResponseBody响应浏览器数据</a>
<a th:href="@{testResponseUser}">通过@ResponseUser响应浏览器User对象</a>


<div id="app">
    <a th:href="@{/testAxios}" @click="testAxios">使用SpringMVC测试Ajax请求</a>
</div>
</body>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
    var vue = new Vue({
        el:"#app",
        data:{},
        methods:{
            testAxios:function (event){
                axios({
                    method:"post",
                    url:event.target.href,
                    params:{
                        username:"admin",
                        password:"123456",
                    }
                }).then(function (response){
                    alert(response.data)
                });
                event.preventDefault();
            }
        }
    })
</script>
</html>